use dioxus::prelude::*;

#[derive(Props, Clone, PartialEq)]
pub struct MenuGroupProps {
    title: String,
    children: Element,
}

#[component]
pub fn MenuGroup(props: MenuGroupProps) -> Element {
    let mut is_open = use_signal(|| true);

    rsx! {
        div { class: "menu-group",
            h3 { 
                class: "menu-group-title",
                onclick: move |_| is_open.toggle(),
                "{props.title}"
            }
            div { 
                class: "menu-group-items",
                hidden: !is_open(),
                {props.children}
            }
        }
    }
}
